<template>
	<view class="main-content">
		<index-header :statusBarHeight="statusBarHeight"></index-header>
		<view class="content" :style="{'padding-top': statusBarHeightS +'px'}">
			<view class="bg">
				<ban title="团体会员"></ban>
				 <scroll-view scroll-x="true" class="bookshelf-content">
				        <block v-for="(item, index) in imgList" :key="index">
				          <view class="item">
				            <view class="img">
				              <image class="simage" :src="item.pic" mode=""></image>
				            </view>
				            <text class="item-title text-over-1">{{item.title}}</text>
				          </view>
				        </block>
				</scroll-view>
				<view class="yw" v-html="ywConten">
				</view>
				<ban title="文件下载"></ban>
				<view style="border-bottom: 1upx solid #DDDDDD;height: 1upx;"></view>
				<view class="dow">
					<view>• 关于网上申请加入团体会员和缴纳会费的通知（2021年1月15日）</view>
					<view>• 关于网上申请加入团体会员的通知（2020年4月1日）</view>
					<view>• 中国测绘学会关于网上申报团体会员的通知（2018年3月19日）</view>
					<view>• 关于发展中国测绘学会团体会员的通知（2018年1月23日）</view>
					<view style="float: right;">查看更多</view>
				</view>
				
				<ban title="联系我们"></ban>
				<view style="border-bottom: 1upx solid #DDDDDD;height: 1upx;"></view>
				<view class="dow">
					<view>• 学术交流处：010-63881345、010-63881355</view>
					<view>• QQ群：1095585260  （591687962群已满）</view>
					<view class="bookshelf-content">
						<view class="item" style="width: 200upx;" @click="jump()">
						  <view >
						    <image class="simage" style="width: 200upx;" src="../../static/img/tdhy1.png" mode=""></image>
						  </view>
						  <text class="item-title text-over-1">网上申请入口</text>
						</view>
						<view class="item" style="width: 200upx;">
						  <view >
						    <image class="simage" style="width: 200upx;" src="../../static/img/qqq.png" mode=""></image>
						  </view>
						  <text class="item-title text-over-1">团体会员QQ群</text>
						</view>
						<view class="item" style="width: 200upx;">
						  <view >
						    <image class="simage" style="width: 200upx;" src="../../static/img/ewm.jpg" mode=""></image>
						  </view>
						  <text class="item-title text-over-1">学会微信公众号</text>
						</view>
					</view>
				</view>
			</view>
	    </view>
		<bottom></bottom>
	</view>
</template>

<script>
	export default{
		data() {
		    return {
				imgList:[
					{pic:'http://www.csgpc.org/upload_files/article/1297/1_20200909140945_en0v5.jpg',title:'北京超图集团'},
					{pic:'http://www.csgpc.org/upload_files/article/1297/1_20200909140945_en0v5.jpg',title:'北京超图集团'},
					{pic:'http://www.csgpc.org/upload_files/article/1297/1_20200909140945_en0v5.jpg',title:'北京超图集团'},
					{pic:'http://www.csgpc.org/upload_files/article/1297/1_20200909140945_en0v5.jpg',title:'北京超图集团'},
					{pic:'http://www.csgpc.org/upload_files/article/1297/1_20200909140945_en0v5.jpg',title:'北京超图集团'},
					],
				ywConten:'<ul style="padding:20px"><p style="text-align:center;line-height:1.75em;margin-top:5px;"><strong><span style="font-size:18px;">团体会员入会条件、程序、权利及义务</span></strong></p><p style="text-align:center;line-height:1.75em;margin-top:5px;"><strong><span style="font-size:18px;"><br></span></strong></p><p style="line-height:2em;margin-bottom:10px;margin-top:10px;"><strong><span style="color:#000000;"><span style="color:#000000;font-size:20px;"> </span><span style="color:#000000;font-size:16px;">一、团体会员入会的条件</span></span></strong></p><p style="text-indent:2em;line-height:2em;margin-bottom:10px;"><span style="color:#000000;font-size:14px;">应为具有独立法人资格的从事测绘地理信息相关工作的科研院所、高校、企事业单位、民间团体等，并具备以下条件：</span></p><p style="text-indent:2em;line-height:2em;margin-bottom:10px;margin-top:10px;"><span style="color:#000000;font-size:14px;">（一）拥护学会章程，从事业务与学会的学科（或专业）有关。</span></p><p style="text-indent:2em;line-height:2em;margin-bottom:10px;margin-top:10px;"><span style="color:#000000;font-size:14px;">（二）具有一定数量的科技人员，业务综合实力较强，在行业内有较大影响。具有甲级测绘资质的单位可优先入会。</span></p><p style="text-indent:2em;line-height:2em;margin-bottom:10px;margin-top:10px;"><span style="color:#000000;font-size:14px;">（三）计划单列市以上的地方测绘（地理信息）学会，或其他依法注册的与学会相关的学术性、科普性、行业性社会团体，可直接申请转为单位会员。</span></p><p style="line-height:2em;margin-bottom:10px;margin-top:10px;"><strong><span style="color:#000000;font-size:16px;">二、团体会员的权利</span></strong></p><p style="text-indent:2em;line-height:2em;margin-bottom:10px;margin-top:10px;"><span style="color:#000000;font-size:14px;">（一）优先参加本会组织的学术交流、科学普及、国际交流等有关活动；</span></p></ul>',
				statusBarHeight:'',
				statusBarHeightS:''
			};
		},
		onShow(e) {
		    // #ifdef MP-WEIXIN || APP-PLUS || APP-PLUS-NVUE
			   var sysinfo = uni.getSystemInfoSync();
			   this.statusBarHeight = sysinfo.statusBarHeight + 44;
			   this.statusBarHeightS = sysinfo.statusBarHeight + 100;
			// #endif
			// #ifdef H5
			   var sysinfo = uni.getSystemInfoSync();
			   this.statusBarHeight = '0';
			   this.statusBarHeightS = '60';
			// #endif
		},
		methods:{
			// H5平台使用 window.open；小程序平台使用web-view组件（url需在小程序的联网白名单中）
			jump() {
				let url = 'http://fw.csgpc.org/Csgpc/login.aspx'
				//#ifdef H5
					window.open(url)
				//#endif
				//#ifdef MP-WEIXIN
					let toUrl = '/pages/service/commonWebview?webTitle=' + e.title + '&webUrl=' + url
					uni.navigateTo({
						url: url
					})
				//#endif
			}
		}
	}
	
</script>

<style lang="scss">
    .content {
        width: 750upx;
        height: auto;
        padding-top: 108upx;
		margin-bottom: 100upx;
		min-height: calc(100% - 631upx);
    }
	.dow{
		background: #FFFFFF;
		border: 1px solid #DDDDDD;
		margin: 20upx;
		padding: 20upx 10upx;
		padding-bottom: 50upx;
	}
	
	.yw{
		background-color: #EEEEEE;
		padding-top: 20upx;
	}
	.yw_title{
		    font-weight: bold;
			font-size: 24upx;
			text-align: center;
	}
      .bookshelf-content {
        white-space: nowrap; // 滚动必须加的属性
        width: 100%;
        height: 280upx;
        padding: 20upx;
        margin: 0 auto;
		}
        .item {
          width: 280upx;
          margin-right: 20upx;
          display: inline-block;
          vertical-align: top;
		  }
          .img {
            display: inline-block;
			}
            .simage {
              width: 280upx;
              height: 220upx;
              border: 1px #e5e5e5 solid;
            }
          .item-title {
            display: block; // 让字体换行
            width: 90%;
            font-size: 14upx;
            line-height: 40upx;
			text-align: center;
          }
</style>
